<template>
	<view class="bg-light" style="height: 100%;">
		<tabsTop tabName="添加联系人"></tabsTop>
		<!-- 自提人信息 -->
		<view class="mx-2 my-2 bg-white rounded-lg">
			<view class="mx-2 py-2 flex align-center border-bottom border-light-secondary">
				<text class="font flex-shrink" style="width: 20%;">姓名</text>
				<input v-model="form.Name" class="ml-2 font w-100" placeholder-class="font text-muted"
					placeholder="收货人姓名" type="text" />
			</view>
			<view class="mx-2 py-2 flex align-center border-bottom border-light-secondary">
				<text class="font flex-shrink" style="width: 20%;">手机号码</text>
				<input v-model="form.Phone" class="ml-2 font w-100" placeholder-class="font text-muted"
					placeholder="收货人手机号" type="text" />
			</view>
		</view>
		<!-- 设置默认自提人 -->
		<view class="mx-2 mb-2 bg-white rounded-lg">
			<view class="mx-2 py-1 flex justify-between align-center">
				<text class="font">设置默认联系人</text>
				<switch class="flex-shrink" style="transform:scale(0.8)" :checked="isdefault" @change="handleswitch()" />
			</view>
		</view>
		<!-- 底部按钮 -->
		<view class="flex align-center justify-between" style="height: 110rpx;">
			<view @click="handlesubmit()" class="mx-3 w-100 bg-success px-3 py-2 rounded-circle flex justify-center">
				<text class="text-white font">保存并使用</text>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import tabsTop from "@/components/tabs/tabs-top.vue";
	import tabsBottom from "@/components/tabs/tabs-bottom.vue";
	import { getAddAction} from "@/api/global.js";
	import { validate,validatemobile} from "@/static/js/GeneralUtil.js"
	export default {
		components: {
			tabsTop,
			tabsBottom,
		},
		data() {
			return {
				form: {
					Picker_SerialNumber: '',
					Open_ID: app.globalData.Open_ID,
					Name: '',
					Phone: '',
					App_ID: app.globalData.App_ID
				},
				isdefault: false, //默认
				loading: false, //节流
			}
		},
		methods: {
			handleswitch(){//默认收获地址
				this.isdefault = !this.isdefault
			},
			async handlesubmit() { //保存并提交使用
				//校验+节流
				if (validate(this.form.Name,'请输入收货人姓名') && validatemobile(this.form.Phone)) {
					uni.showLoading({
						title: "加载中...",
					});
					const res = await getAddAction({
						Data: JSON.stringify({member_picker_info: [this.form]}),
						Open_ID: app.globalData.Open_ID
					})
					uni.hideLoading();
					if (res.Status == "success") {
						//判断是否为默认地址
						if (this.isdefault) {
							this.form.Picker_SerialNumber = res.Data
							uni.setStorageSync("defaultPerson", this.form)
						}
						uni.showToast({
							title: '提交成功！',
							icon: 'success'
						})
						const timer = setTimeout(() => {
							clearTimeout(timer)
							uni.navigateBack() //后退
						}, 500)
					} else {
						uni.showToast({
							title: '提交失败！',
							icon: 'error'
						})
					}
					this.loading = false;
				}
			}
		}
	}
</script>

<style>
</style>